<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
    <link rel="stylesheet" href="/static/bootstrap/css/jquery.treegrid.css"/>
    <#include "/common/base_include.ftl"/>
    <script type="text/javascript" src="/static/bootstrap/bootstrap-table/jquery.treegrid.js"></script>
    <script type="text/javascript" src="/static/bootstrap/bootstrap-table/jquery.treegrid.extension.js"></script>
    <script type="text/javascript" src="/static/bootstrap/bootstrap-table/jquery.treegrid.bootstrap3.js"></script>

</head>
<body>
<div class="wrapper wrapper-content ">
    <div class="col-sm-12">
        <div class="ibox">
            <div class="fixed-table-toolbar">
            </div>
            <table id="exampleTable" data-mobile-responsive="true"></table>
        </div>
    </div>
    <script type="text/javascript">


        var prefix = "/system/sysDept"
        $(function () {
            load();
        });

        function load() {
            $('#exampleTable').bootstrapTreeTable({
                id: 'deptId',
                code: 'deptId',
                parentCode: 'parentId',
                type: "GET", // 请求数据的ajax类型
                url: prefix + '/list', // 请求数据的ajax的url
                ajaxParams: {}, // 请求数据的ajax的data属性
                expandColumn: '1', // 在哪一列上面显示展开按钮
                striped: true, // 是否各行渐变色
                bordered: true, // 是否显示边框
                expandAll: false, // 是否全部展开
                rootCodeValue: "-1",
                // toolbar : '#exampleToolbar',
                columns: [
                    {
                        title: '编号',
                        field: 'deptId',
                        visible: false,
                        align: 'center',
                        valign: 'center',
                        width: '50px',
                        checkbox: true
                    },
                    {
                        field: 'name',
                        title: '部门名称',
                        valign: 'center',
                        witth: 20
                    },
                    {
                        field: 'deptCode',
                        title: '部门编号',
                        valign: 'center',
                        witth: 20
                    },
                    {
                        field: 'orderNum',
                        title: '排序',
                        align: 'center',
                        valign: 'center',
                    },
                    {
                        field: 'delFlag',
                        title: '状态',
                        align: 'center',
                        valign: 'center',
                        formatter: function (item, index) {
                            if (item.delFlag == '0') {
                                return '<span class="label label-danger">禁用</span>';
                            } else if (item.delFlag == '1') {
                                return '<span class="label label-primary">正常</span>';
                            }
                        }
                    },
                    {
                        title: '操作',
                        field: 'id',
                        align: 'center',
                        valign: 'center',
                        formatter: function (row, index) {
                            if (row.deptId == "0") {
                                var add = '<@shiro.hasPermission name="system:sysDept:add">' +
                                    '<a class="btn btn-primary btn-sm " href="#" title="增加下級"  mce_href="#" onclick="modify(\'add\',\'' + row.deptId + '\')"><i class="fa fa-plus"></i></a>' +
                                    '</@shiro.hasPermission>';
                                return add;
                            }
                            var e = '<@shiro.hasPermission name="system:sysDept:edit">' +
                                '<a class="btn btn-primary btn-sm " href="#" title="编辑"   mce_href="#" onclick="modify(\'edit\',\''
                                + row.deptId + '\')"><i class="fa fa-edit"></i></a>' +
                                ' </@shiro.hasPermission>';
                            var a = '<@shiro.hasPermission name="system:sysDept:add">' +
                                '<a class="btn btn-primary btn-sm " href="#" title="增加下級"  mce_href="#" onclick="modify(\'add\',\'' + row.deptId + '\')"><i class="fa fa-plus"></i></a>' +
                                '</@shiro.hasPermission>';
                            var d = '<@shiro.hasPermission name="system:sysDept:remove">' +
                                '<a class="btn btn-warning btn-sm " href="#" title="删除"  mce_href="#" onclick="removeone(\''
                                + row.deptId
                                + '\')"><i class="fa fa-remove"></i></a>' +
                                ' </@shiro.hasPermission>';
                            return e + a + d;
                        }
                    }]
            });
        }

        function reLoadTree() {
            load();
        }

        function modify(option, id) {
            var url = prefix + "/modify";
            url += "?option=" + option + "&id=" + id;
            var title = ('add' == option ? '增加' : "编辑");
            layer_open_1(url, title, function (index, layerno) {
                current_index = index;
               $(layerno).find('form').submit();
            });
        }

        // function add(pId) {
        //  layer_open(prefix + '/add/' + pId, '增加');
        // }
        // function edit(id) {
        //  layer_open(prefix + '/edit/' + id, '编辑');
        // }
        function removeone(id) {
            layer.confirm('确定要删除选中的记录？', {
                btn: ['确定', '取消']
            }, function () {
                $.ajax({
                    url: prefix + "/remove",
                    type: "post",
                    data: {
                        'deptId': id
                    },
                    success: function (r) {
                        if (r.code == 0) {
                            layer.msg(r.msg);
                            reLoadTree();
                        } else {
                            layer.msg(r.msg);
                        }
                    }
                });
            })
        }

    </script>
</body>
</html>